function makeGauge(el, data) {
    // data = [{value:40}] // 用户数据,最好是 0 - 100 的值   
    // el : id
    
    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById(el));


    // * 渐变色 表盘的渐变色
    // * offset 代表的是颜色的位置节点
    // ** 注意： 必须从零开始，1 结束，不然后期指针颜色计算会报错
    const gaugeBgColor = new echarts.graphic.LinearGradient(0, 0, 1, 0, [
      {
        offset: 0,
        color: '#7dff7d'
      },
      {
        offset: 0.55,
        color: '#ffff00'
      },
      {
        offset: 1,
        color: '#ff0000'
      }
    ])
    const itemColor = getPerColor(gaugeBgColor.colorStops, data[0].value / 100)

    // 指定图表的配置项和数据
    var hide = { show: false }
    var option = {
        series: [
          {
            type: 'gauge',
            splitLine: hide,
            axisTick: hide,
            axisLabel: hide,
            startAngle: 165, // 起始角度
            endAngle: 15, // 最终角度
            axisLine: {
              lineStyle: { // 表盘
                width: 15,
                color: [
                    // 表盘的颜色
                  [1, gaugeBgColor]
                ]
              }
            },
            // 指针的颜色
            itemStyle: {
              color: itemColor
            },
            // 字体的颜色
            detail: { formatter: '{value}%', color: itemColor },
            data: data
          }
        ]
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
}





// 计算当前{{ 数值 }}在整个渐变色中，应该是什么颜色
function getPerColor (gaugeBgColor, per) {
  if (isNaN(per) || typeof per !== 'number') {
    console.warn('getPerColor-per: 请传入正确的 百分比数值')
    return
  }
  let befor, after
  for (let i = 0; i < gaugeBgColor.length; i++) {
    const item = gaugeBgColor[i]
    if (item.offset > per) {
      after = item
      break
    } else {
      befor = item
    }
  }
  if (!befor || !after) {
    console.warn('getPerColor-gaugeBgColor: 请传入正确的 参数')
    return
  }
  per = (per - befor.offset) / (after.offset - befor.offset)
  return getNowColor(befor.color, after.color, per)
}

function getNowColor (startColor, endColor, per) {
  // 将hex转换为rgb
  const sColor = hexToRgb(startColor)
  const eColor = hexToRgb(endColor)

  // 计算R\G\B每一步的差值
  const rStep = eColor[0] - sColor[0]
  const gStep = eColor[1] - sColor[1]
  const bStep = eColor[2] - sColor[2]
  function p (b, p) {
    return parseInt(b + p * per)
  }
  return rgbToHex(p(sColor[0], rStep), p(sColor[1], gStep), p(sColor[2], bStep))
}

// 以下代码来自知乎，
// 作者：你爱谁如鲸向海
// 链接：https://www.zhihu.com/question/38869928/answer/81242646
// 来源：知乎
// 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
function rgbToHex (r, g, b) {
  const hex = ((r << 16) | (g << 8) | b).toString(16)
  return '#' + new Array(Math.abs(hex.length - 7)).join('0') + hex
}

function hexToRgb (hex) {
  const rgb = []
  for (let i = 1; i < 7; i += 2) {
    rgb.push(parseInt('0x' + hex.slice(i, i + 2)))
  }
  return rgb
}